<template>
	<view class="goods-box">
		<scroll-view scroll-y @scrolltolower="$emit('getData')" lower-threshold="60">
			<view class="u-flex align-initial">
				<view class="flex-2 u-p-r-8">
					<view class="goods-item u-m-b-16 bg-white" v-for="item in leftGoodsList" :key="item.id"
						@tap="goTo(item)">
						<view class="image" :style="[{height}]">
							<image mode="aspectFill" :style="[{width:'100%',height}]" :src="$fullLink(item.coverImg)">
							</image>
						</view>
						<view class="goods-body u-flex flex-col align-initial u-rela">
							<view class="goods-title u-rela">
								<view class="self-icon u-abso" v-if="appHasOwn&&item.hasOwn == 1">
									{{ $t('classify.自营') }}
								</view>
								<text class="u-line-2"
									:class="{ indent: item.hasOwn == 1&&appHasOwn }">{{ item.name }}</text>
							</view>
							<!-- 活动信息 -->
							<activityBadge :info="item"></activityBadge>
							<view>
								<view class="price w-500 c-red">
									<text class="u-font-24">{{$unitEn}}</text>
									<text class="u-font-32">{{ item.price }}</text>
									<text class="u-font-24 u-m-l-10 c-placeholder"
										style="text-decoration:line-through; " v-if="item.priceScribing">￥{{ Math.floor(item.priceScribing) }}</text>
								</view>
								<view class="u-font-24 c-placeholder">
									<text class="u-font-24 c-red"
										v-if="item.contributionValue">积分:{{ item.contributionValue}}</text>
								</view>
								<view class="u-font-24 c-placeholder u-m-b-10">
<!--									<text>{{ $t('common.销量') }}：</text>-->
<!--									<text>{{ item.stockSold }}</text>-->
								</view>
							</view>
							<view class="car-icon-button u-abso text-center">
								<text class="iconfont icon-gouwuche2 c-primary u-font-36" v-if="showIcon"></text>
							</view>
						</view>
					</view>
				</view>
				<view class="flex-2 u-p-l-8">
					<view class="goods-item u-m-b-16 bg-white" v-for="item in rightGoodsList" :key="item.id"
						@tap="goTo(item)">
						<view class="image" :style="[{height}]">
							<image mode="aspectFill" :style="[{width:'100%',height}]" :src="$fullLink(item.coverImg)">
							</image>
						</view>
						<view class="goods-body u-flex flex-col align-initial u-rela">
							<view class="goods-title u-rela">
								<view class="self-icon u-abso" v-if="appHasOwn&&item.hasOwn == 1">
									{{ $t('classify.自营') }}
								</view>
								<text class="u-line-2"
									:class="{ indent: item.hasOwn == 1&&appHasOwn }">{{ item.name }}</text>
							</view>
							<!-- 活动信息 -->
							<activityBadge :info="item"></activityBadge>
							<view>
								<view class="price w-500 c-red">
									<text class="u-font-24">{{$unitEn}}</text>
									<text class="u-font-32">{{ item.price }}</text>
									<text class="u-font-24 u-m-l-10 c-placeholder"
										style="text-decoration:line-through; " v-if="item.priceScribing">￥{{ Math.floor(item.priceScribing) }}</text>
								</view>
								<view class="u-font-24 c-placeholder">
									<text class="u-font-24 c-red"
										v-if="item.contributionValue">积分:{{ item.contributionValue }}</text>
								</view>
								<view class="u-font-24 c-placeholder u-m-b-10">
<!--									<text>{{ $t('common.销量') }}：</text>-->
<!--									<text>{{ item.stockSold }}</text>-->
								</view>
							</view>
							<view class="car-icon-button u-abso text-center">
								<text class="iconfont icon-gouwuche2 c-primary u-font-36" v-if="showIcon"></text>
							</view>
						</view>
					</view>
				</view>
			</view>
			<load-more :showLoad="showLoad"></load-more>
		</scroll-view>
	</view>
</template>

<script>
	import activityBadge from './activityBadge.vue'
	export default {
		components: {
			activityBadge
		},
		props: {
			showLoad: Boolean,
			leftGoodsList: Array,
			rightGoodsList: Array,
			height: {
				type: String,
				default: '346rpx'
			},
			scrollH: {
				type: String,
				default: '100%'
			},
			showIcon: {
				type: Boolean,
				default: true
			}
		},
		data() {
			return {
				appHasOwn: false
			}
		},
		methods: {
			goTo(item) {
				if (item.type == 3) {
					this.$goTo("/pages/takeaway/shop?id=" + item.storeId)
					return
				}



                let {subareaId,categoryOne,id,hasOwn} = item

                //厂家直营商品详情
                if(hasOwn!=1){
                    this.$goTo('/pages/classify/goods/info/index', {
                    	id: item.id
                    })
                    return;
                }

                this.$goTo('/pages/classify/relateGoods',{categoryOne, subareaId,id})




			}
		}
	}
</script>

<style lang="scss" scoped>
	.goods-box {
		height: 100%;
		padding: 20rpx 24rpx;

		scroll-view {
			height: calc(100vh - 210rpx)
		}

		.goods-item {
			border-radius: 10rpx;
			overflow: hidden;

			&:nth-child(2n) {
				margin-right: 0;
			}

			.image {
				width: 100%;
			}

			.goods-body {
				padding: 12rpx 20rpx 0 20rpx;
				// height: 176rpx;

				.goods-title {
					flex: 1;

					.self-icon {
						left: 0;
						top: 0;
					}

					.indent {
						text-indent: 76rpx;
						display: inline-block;
					}
				}

				.car-icon-button {
					right: 20rpx;
					bottom: 20rpx;
					// text {
					// 	font-size: 48rpx;
					// }
				}
			}
		}
	}
</style>
